<!DOCTYPE html>
<html lang="en">

<head>
    <title>新增泵房</title>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link href="../css/global.css" rel="stylesheet">
    <link rel="stylesheet" href="../css/iconfont/iconfont.css">
    <link rel="stylesheet" href="../css/addEquipment.css">
    <script src="../js/vue.js"></script>
    <script src="../js/axios.js"></script>
    <link rel="stylesheet" href="../css/nutui/dist/nutui.css">
    <script src="../css/nutui/dist/nutui.js"></script>
</head>

<body>
    <div id="app">
        <div class="app_header">
            <div class="app_headerLeft" @click="back">
                <span class="iconfont icon-arrow-left-bold"></span>
            </div>
            <div class="app_headerTitle">新增泵房</div>
        </div>
        <div class="appMain">
            <div class="app_ContTitle">泵房信息</div>
            <div class="app_ContItem">
                <div class="app_ContItem_label">泵房名称<span>*</span></div>
                <div class="app_ContItem_inp">
                    <input type="text" v-model="form.pumpName" placeholder="请输入">
                </div>
            </div>
            <div class="app_ContItem">
                <div class="app_ContItem_label">所属区域<span>*</span></div>
                <div class="app_ContItem_inp">
                    <div :style="{color:form.area == '' ?'#D1D1D1':'#000'}">{{ form.area || '请选择' }}<span
                            class="iconfont icon-arrow-right-bold"></span></div>
                </div>
            </div>
            <div class="app_ContItem">
                <div class="app_ContItem_label">供水方式<span>*</span></div>
                <div class="app_ContItem_inp">
                    <div :style="{color:form.mode == '' ?'#D1D1D1':'#000'}">{{ form.mode || '请选择' }}<span
                            class="iconfont icon-arrow-right-bold"></span></div>
                </div>
            </div>
            <div class="app_ContItem">
                <div class="app_ContItem_label">泵房位置<span>*</span></div>
                <div class="app_ContItem_inp">
                    <div :style="{color:form.pumpRoomInfo == '' ?'#D1D1D1':'#000'}">{{ form.pumpRoomInfo || '请选择'
                        }}<span class="iconfont icon-arrow-right-bold"></span></div>
                </div>
            </div>
            <div class="app_ContItem">
                <div class="app_ContItem_label">水箱个数<span>*</span></div>
                <div class="app_ContItem_inp">
                    <div :style="{color:form.num == '' ?'#D1D1D1':'#000'}">{{ form.num || '请选择' }}<span
                            class="iconfont icon-arrow-right-bold"></span></div>
                </div>
            </div>
            <div class="app_ContItem">
                <div class="app_ContItem_label">负责人<span>*</span></div>
                <div class="app_ContItem_inp">
                    <div :style="{color:form.people == '' ?'#D1D1D1':'#000'}">{{ form.people || '请选择' }}<span
                            class="iconfont icon-arrow-right-bold"></span></div>
                </div>
            </div>
            <div class="app_ContItem">
                <div class="app_ContItem_label">所在位置<span>*</span></div>
                <div class="app_ContItem_inp">
                    <div :style="{color:form.address == '' ?'#D1D1D1':'#000'}">{{ form.address || '请选择' }}<span
                            class="iconfont icon-arrow-right-bold"></span></div>
                </div>
            </div>
            <div class="app_ContTitle">供水设备</div>
            <div class="app_ContItem1 roomLine" @click="goDeviceBind" v-if="form.waterService.length == 0">
                <span class="iconfont icon-add-bold"></span>添加
            </div>
            <div class="app_mainItem" v-else v-for="(item, index) in 4">
                <div class="app_mainItemLeft">
                    <div class="stateDom2">闲置中</div>
                </div>
                <div class="app_mainItemRight">
                    <div class="title str">ALCW智能型无负压供水设备</div>
                    <div class="tabs str">无负压变频供水</div>
                    <div class="time str">添加时间：2022/03/23 12:00</div>
                </div>
            </div>
            <div class="app_ContTitle">智能门禁</div>
            <div class="app_ContItem1 roomLine" @click="goAccessControl" v-if="form.entranceGuard.length == 0">
                <span class="iconfont icon-add-bold"></span>添加
            </div>
            <div class="mainItemList" v-else>
                <div class="mainItemList_left">
                    <div class="mainItemList_leftBGcolor1">
                        <span class="iconfont icon-xinxi"></span>
                    </div>
                    <div>报装</div>
                </div>
                <div class="mainItemList_right"><span class="iconfont  icon-arrow-left-bold"></span></div>
            </div>
        </div>
        <nut-button block>保存</nut-button>
    </div>
    <script>
        var vm = new Vue({
            el: '#app',
            data: {
                form: {
                    pumpName: '',//泵房名称
                    area: '',//所属区域
                    mode: '',//供水方式
                    pumpRoomInfo: '',//泵房位置
                    num: '',//水箱个数
                    people: '',//负责人
                    address: '',//所在位置
                    waterService: [],//供水设备
                    entranceGuard: [],//智能门禁
                }
            },
            mounted() { },
            methods: {
                back() {
                    window.history.go(-1);
                },
                goDeviceBind(){
                    window.location.href = './deviceBind.html'
                },
                goAccessControl(){
                    window.location.href = './accessControl.html'
                }
            }
        })
    </script>
</body>

</html>